<template>
    <div class='item'>
      <div class="title clearfix">
        <div class="title_name l">{{data.title}}</div>
        <a class="add_icon r" href="javascript:;"><span class="iconfont">&#xe609;</span>Add</a>
      </div>
      <div class="list">
        <ul>
          <li v-for="item in data.list" track-by="$index">
            2012.09—2016.06, educated at  MIT of science, get a master degr
            <span class="iconfont r">&#xe60d;</span>
            <span class="iconfont r">&#xe607;</span>
          </li>
        </ul>
      </div>
    </div>
</template>
<style rel="stylesheet/scss" type="text/css" lang="scss" scoped>
  @import "../../assets/css/variable";
  .item {
    line-height: 40px;
    .title{
      line-height: 40px;
      box-shadow: 0 2px 2px -1px #c9c9c9;
      .title_name{
        position: relative;
        font-size: 16px;
        color: rgb(10, 10, 10);
        &:before{
          content: '';
          position: absolute;
          left: 0;
          right: -50px;
          bottom:-3px;
          height: 1px;
          background-color: $activeColor;
        }
      }
    }
    .add_icon {
      font-size: 14px;
      color: rgb(69, 69, 69);
      .iconfont {
        color: $activeColor;
        font-size: 20px;
        margin-right: 10px;
      }
      &:hover {
        color: $activeColor;
      }
    }
    .list {
      padding: 20px 0;
      line-height: 30px;
      font-size: 16px;
      color: rgb(102, 102, 102);
      li {
        .iconfont{
          padding-left:8px ;
          color: rgb(102, 102, 102);
          cursor: pointer;
          &:hover{
            color: $activeColor;
          }
        }
      }
    }
  }
</style>
<script>
    import  dModal from './Modal.vue'
    export default{
        components:{
          dModal
        },
        ready:function () {

        },
        data:function () {
          return{
            show:true
          }
        },
        methods: {
          setFullScreen:function (e) {

          }
        },
        props:{
          data:{
            type:Object,
          }
        }
    }
</script>
